<template>
	<view style="width: 100%;">
		<view class="cu-custom" :style="[{height:navBgImageHeight + 'px'}]">
			<image class="header-bg" :src="showBackground">
			</image>
			<view class="flex justify-center align-center">
				<view class="bg-white round line-gray flex justify-center align-center"
					style="z-index: 999;position: absolute;top: 400upx;width: 136upx;height: 136upx;">
					<view class="cu-avatar xl round"
						:style="'background-image: url('+circle.avatar+');width:118upx;height:118upx;'"></view>
				</view>
			</view>
			<view class="cu-bar fixed"
				:style="'height:'+navHeight+'px;padding-top:'+statusHeight+'px;opacity:'+searchOpacity+';'">
				<view @tap="backAction" class="padding-left flex align-center justify-start">
					<text class="cuIcon cuIcon-back text-white"></text>
					<text class="text-white text-lg">{{isFromOutside?'首页':'返回'}}</text>
				</view>
			</view>
			<view :class="'cu-bar fixed '+themeColor"
				:style="'width:100%;height:'+navHeight+'px;padding-top:'+statusHeight+'px;opacity:'+navOpacity+';'">
				<view style="min-width: 150upx;" @tap="backAction" class="padding-left flex align-center justify-start">
					<text class="cuIcon cuIcon-back text-white"></text>
					<text class="text-white text-lg">{{isFromOutside?'首页':'返回'}}</text>
				</view>
				<view class="flex justify-center align-center" style="width: 100%;">
					<text class="text-white text-bold">{{circle.name}}</text>
				</view>
			</view>
		</view>
		<view class="flex justify-center align-center">
			<view class="cu-card article" style="position: absolute;z-index: 99;width: 94%;height: 300upx;top: 445upx;">
				<view class="cu-item shadow-warp">
					<view class="flex justify-center align-center" style="width: 100%;padding-top: 70upx;">
						<text class="text-xl text-bold">{{circle.name}}</text>
					</view>
					<view class="flex justify-center align-center padding-top-sm">
						<text class="text-df text-grey text-cut">{{circle.introduce}}</text>
					</view>
					<view class="flex justify-around align-center padding" style="width: 100%;">
						<view class="flex justify-center align-center solid-right" style="width:33.3%;">
							<text class="text-gray">圈友{{circle.member_count}}</text>
						</view>
						<view class="flex justify-center align-center solid-right" style="width: 33.3%;">
							<text class="text-gray">动态{{circle.post_count}}</text>
						</view>
						<view class="flex justify-center align-center" style="width: 33.3%;">
							<text class="text-gray">话题{{circle.topic_count}}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view v-if="windowWidth>320">
			<view style="height: 170upx;"></view>
		</view>
		<view v-else>
			<view style="height: 160upx;"></view>
		</view>
		<view class="solid-bottom solid-top"
			:style="[navOpacity>0.85?'z-index:99;width: 100%;position:fixed;':'width: 100%;']+[navOpacity>0.85?'top:'+fixNavTop+'px;':'']">
			<scroll-view scroll-x class="bg-white nav" scroll-with-animation :scroll-left="scrollLeft">
				<view class="flex text-center">
					<view class="cu-item flex-sub text-df text-lg" :class="index==TabCur?'text-blue cur':''"
						v-for="(item,index) in navItems" :key="index" @tap="tabSelect" :data-id="index">
						{{item}}
					</view>
				</view>
			</scroll-view>
		</view>
		<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :up="upOption">
			<view v-for="(item,index) in dataList" :key="index">
				<active-post-item v-if="TabCur<2" @clickTopic="clickTopicAction(item.circle_topic)"
					@delete="deleteAction(index)" @report="reportAction(index)"
					:showDelete="item.owner_id==userInfo.user_id||userInfo.user_id==circle.owner_id||userInfo.role_id>0"
					@favorite="favoriteAction(index)" @praise="praiseAction(index)" @reward="rewardAction(index)"
					:index="index" @reply="replyComment" @loadMoreComment="loadMoreComment(index,item)"
					@expand="expandAction(index)" @commentAction="sendCommentAction(index,item)" :post="item"
					:circleOwnerId="circle.owner_id"
					@commentExpand="activeCommentExpand"
					></active-post-item>
				<circle-topic-item v-else-if="TabCur==2" @tap="jumpToCircleTopicDetail(item)" :topic="item">
				</circle-topic-item>
				<list-user-item v-else-if="TabCur==3" :userInfo="item" :showCircleOwner="item.user_id==circle.owner_id">
				</list-user-item>
			</view>
		</mescroll-body>
		<float-tabbar ref="floatBar" :leftTitle="circle.is_joined==1?'退圈':'加入'"
			:leftIcon="circle.is_joined==1?'exit':'add'" :showLeftIcon="true" @leftClick="applyJoinAction"
			@middleClick="jumpToPublish" :needAction="floatBarNeedAction&&showInputPanel==false" class="float-bar">
		</float-tabbar>
		<input-panel @onReplySuccess="onReplySuccess" @onCommentSuccess="onCommentSuccess"
			:originInfo="inputPanelOriginInfo" @blur="showInputPanel=false" title="写评论" doneBtn="发表" :autoFocus="true"
			v-if="showInputPanel" class="input-panel"></input-panel>
		<score-pay :userInfo="userInfo" :index="scorePostIndex" @chooseScore="chooseScoreAction"
			@hidden="showScorePay=false" v-if="showScorePay" ref="scorePay" class="input-panel"></score-pay>
		<view class="cu-modal" :class="form.modalStatus">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">{{formTitle}}</view>
					<view class="action" @tap="form.modalStatus=''">
						<text class="cuIcon-close text-red"></text>
					</view>
				</view>
				<view class="padding-xl flex justify-start" style="flex-direction: column;">
					<view class="flex justify-center align-center padding-bottom-lg" style="width: 100%;">
						<textarea v-if="form.modalStatus.length > 0"
							class="bg-white radius padding-top padding-left text-left" v-model="form.textInput"
							placeholder="请输入内容"></textarea>
					</view>
					<view class="action flex justify-center padding bg-white" style="width: 100%;">
						<button @tap="commitOperateAction" class="cu-btn round bg-blue" style="width: 90%;">提交</button>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	import ActivePostItem from '@/components/active-post-item.vue';
	import FloatTabbar from '@/components/float-tabbar.vue';
	import InputPanel from '@/components/input-panel.vue'
	import ScorePay from '@/components/score-pay.vue';
	import CircleTopicItem from '@/components/circle-topic-item.vue'
	import ListUserItem from '@/components/list-user-item.vue'
	import {
		getCircleInfo,
		getActivePostListByCircle,
		getActivePostCommentList,
		rewardOther,
		getUserInfoDetail,
		praise,
		favoritePost,
		reportPost,
		deleteActivePost,
		applyJoinCircle,
		cancelCircle,
		getTopicListByCircleId,
		getCircleMemberList
	} from '@/api/api.js'
	import {
		isLogin,
		getUserInfo,
		updateUserInfo
	} from '@/api/auth.js'
	import {
		checkLogin
	} from '@/js_sdk/checkLogin.js'
	import {
		getTimeDistance
	} from '@/api/utils.js'
	import config from '@/api/config.js'
	export default {
		mixins: [MescrollMixin],
		components: {
			FloatTabbar,
			ActivePostItem,
			InputPanel,
			ScorePay,
			CircleTopicItem,
			ListUserItem
		},
		data() {
			return {
				isFromOutside: false,
				form: {
					isPasswordJoin: false,
					isApply: false,
					modalStatus: '',
					reportPostId: '',
					textInput: '',
				},
				userInfo: getUserInfo(),
				scorePostIndex: -1,
				showScorePay: false,
				inputPanelOriginInfo: null,
				showInputPanel: false,
				floatBarNeedAction: true,
				lastSrollTop: 0,
				navItems: [
					'最新',
					'热门',
					'话题',
					'圈友'
				],
				TabCur: 0,
				scrollLeft: 0,
				circleId: null,
				circle: null,
				themeColor: this.ThemeColor,
				CustomBar: this.CustomBar,
				StatusBar: this.StatusBar,
				windowWidth: 0,
				windowHeight: 0,
				scrollTop: 0,
				dataList: [],
				upOption: {
					page: {
						size: 10 // 每页数据的数量,默认10
					},
					textNoMore: config.customNoMore,
					noMoreSize: 1, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
					empty: {
						tip: '暂无相关数据'
					}
				},
			}
		},
		computed: {
			formTitle() {
				if (this.form.isPasswordJoin) {
					return '请输入入圈口令'
				}
				if (this.form.isApply) {
					return '请输入加圈理由'
				}
				return '举报'
			},
			fixNavTop() {
				console.log('navHeight:' + this.navHeight)
				return this.CustomBar
			},
			searchOpacity() {
				return 1 - this.navOpacity
			},
			showBackground() {
				if (this.circle == null) {
					return this.navBgImage
				}
				return this.circle.background
			},
			navBgImage() {
				return 'https://static.lulingshuo.icodefuture.com/1618910351949'
			},
			navBgImageHeight() {
				return this.windowWidth * 0.8;
			},
			navHeight() {
				return this.CustomBar
			},
			statusHeight() {
				return this.StatusBar
			},
			navOpacity() {
				return this.scrollTop / (this.CustomBar + 140)
			},
		},
		onPageScroll(res) {
			this.scrollTop = res.scrollTop
			if (res.scrollTop <= 0) {
				this.$refs.floatBar.showTabbar()
				return
			}
			let scrollTop = this.lastSrollTop
			if (res.scrollTop > scrollTop) {
				this.$refs.floatBar.hiddenTabbar()
			} else {
				this.$refs.floatBar.showTabbar()
			}
			this.lastSrollTop = res.scrollTop
			uni.$emit('ActivePostListDidSroll')
		},
		onLoad(options) {
			if (options.circleId !== null && options.circleId !== undefined) {
				this.circleId = options.circleId
				this.initCircleInfo()
			}
			if (options.outside !== null && options.outside !== undefined) {
				this.isFromOutside = true
			}
			let _this = this
			uni.getSystemInfo({
				success(res) {
					_this.windowWidth = res.windowWidth
					_this.windowHeight = res.windowHeight
					_this.StatusBar = res.statusBarHeight
					// #ifdef MP-QQ || MP-WEIXIN
					let custom = wx.getMenuButtonBoundingClientRect();
					_this.CustomBar = custom.bottom + custom.top - res.statusBarHeight;
					// #endif
					// #ifdef MP-BAIDU
					let custom = swan.getMenuButtonBoundingClientRect();
					_this.CustomBar = custom.bottom + custom.top - res.statusBarHeight;
					// #endif
				}
			})
		},
		methods: {
			activeCommentExpand(passParams)
			{
				let postIndex = passParams[0]
				let commentIndex = passParams[1]
				let status = this.dataList[postIndex].comment_list[commentIndex].is_expand? false:true
				this.dataList[postIndex].comment_list[commentIndex].is_expand = status
			},
			clickTopicAction(topic) {
				uni.navigateTo({
					url: '/pages/lessuse/circle-topic-post/circle-topic-post?topicId=' + topic.topic_id
				})
			},
			jumpToCircleTopicDetail(topic) {
				uni.navigateTo({
					url: '/pages/lessuse/circle-topic-post/circle-topic-post?topicId=' + topic.topic_id
				})
			},
			hiddenAndResetForm() {
				this.form.modalStatus = null
				this.form.textInput = ''
				this.form.isApply = false
				this.form.isPasswordJoin = false
			},
			realCancelCircle() {
				uni.showLoading({
					title: '正在退出...'
				})
				cancelCircle(this.circle.circle_id).then(res => {
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '您已退出'
					})
					this.circle.is_joined = 0
				}).catch(error => {
					uni.hideLoading()
				})
			},
			realApplyJoin() {
				uni.showLoading({
					title: '正在提交...'
				})
				applyJoinCircle(this.circle.circle_id).then(res => {
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '入圈成功!'
					})
					this.circle.is_joined = 1
				}).catch(error => {
					uni.hideLoading()
				})
			},
			applyJoinAction() {
				if (isLogin() == false) {
					checkLogin()
					return
				}
				if (this.circle.owner_id == this.userInfo.user_id && this.circle.using_avatar == 0) {
					uni.showToast({
						icon: 'none',
						title: '您是圈主，无需加入~'
					})
					return
				}
				if (this.circle.is_joined == 1) {
					let self = this
					uni.showModal({
						title: '退圈提示?',
						content: '确认退出《' + this.circle.name + '》?',
						confirmText: '确定退圈',
						cancelText: '手滑了',
						success: (res) => {
							if (res.confirm) {
								self.realCancelCircle()
							}
						}
					})
					return
				}
				if (this.circle.is_open == 1) {
					this.realApplyJoin()
					return
				}
				//非公开的
				if (this.circle.use_password == 1) {
					this.form.modalStatus = 'show'
					this.form.isPasswordJoin = true
				} else if (this.circle.open_score > 0) {
					let self = this
					uni.showModal({
						title: '入圈提醒',
						content: '加入本圈需要消耗:' + this.circle.open_score + '个山竹,是否继续?',
						cancelText: '取消',
						confirmText: '确定加入',
						success: (res) => {
							if (res.confirm) {
								self.realApplyJoin()
							}
						}
					})
				} else {
					this.form.modalStatus = 'show'
					this.form.isApply = true
				}
			},
			commitOperateAction() {
				if (this.form.isApply) {
					if (this.form.textInput.length == 0) {
						uni.showToast({
							icon: 'none',
							title: '请输入申请理由!'
						})
						return
					}
					uni.showLoading({
						title: '正在提交...'
					})
					applyJoinCircle(this.circle.circle_id, null, this.form.textInput).then(res => {
						uni.hideLoading()
						uni.showToast({
							title: '申请成功，请等待圈主审核!'
						})
						this.hiddenAndResetForm()
					}).catch(error => {
						uni.hideLoading()
					})
					return
					return
				}
				if (this.form.isPasswordJoin) {
					if (this.form.textInput.length == 0) {
						uni.showToast({
							icon: 'none',
							title: '请输入入圈口令!'
						})
						return
					}
					uni.showLoading({
						title: '正在提交...'
					})
					applyJoinCircle(this.circle.circle_id, this.form.textInput).then(res => {
						uni.hideLoading()
						uni.showToast({
							title: '入圈成功!'
						})
						this.circle.is_joined = 1
						this.hiddenAndResetForm()
					}).catch(error => {
						uni.hideLoading()
					})
					return
				}
				if (this.form.textInput.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请输入举报理由!'
					})
					return
				}
				uni.showLoading({
					title: '正在提交...'
				})
				reportPost(this.form.reportPostId, this.form.textInput).then(res => {
					uni.hideLoading()
					uni.showToast({
						title: '举报已提交'
					})
					this.form.modalStatus = null
				}).catch(error => {
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '提交失败'
					})
				})
			},
			realDeleteActivePost(index) {
				uni.showLoading({
					title: '正在删除...'
				})
				let postId = this.dataList[index].post_id
				deleteActivePost(postId, this.circle.circle_id).then(res => {
					uni.hideLoading()
					uni.showToast({
						title: '删除成功!'
					})
					this.dataList.splice(index, 1)
				}).catch(error => {
					uni.hideLoading()
				})
			},
			deleteAction(index) {
				let that = this
				uni.showModal({
					title: '动态删除提示!',
					content: '动态删除后将无法找回，是否继续?',
					cancelText: '手滑了',
					confirmText: '确认删除',
					success: (res) => {
						if (res.confirm) {
							that.realDeleteActivePost(index)
						}
					}
				})
			},
			reportAction(index) {
				this.form.reportPostId = this.dataList[index].post_id
				this.form.modalStatus = 'show'
			},
			onShareAppMessage(res) {
				if (res.from && res.from == "button") {
					if (res.target.dataset !== null && res.target.dataset !== undefined && res.target.dataset.postid !==
						undefined) {
						let dataset = res.target.dataset
						let circle = dataset.circle
						let author = dataset.author
						let postId = dataset.postid
						let title = "快来围观“@" + author + "”在圈子《" + circle + "》发表的精彩动态吧~"
						return {
							title: title,
							path: '/pages/lessuse/active-list/active-list?postId=' + postId + '&outside=1'
						}
					}
				}
				return {
					title: '来自TopicQ《' + this.circle.name + '》圈子的精彩内容',
					path: '/pages/lessuse/circle-profile/circle-profile?circleId=' + this.circleId + '&outside=1'
				}
			},
			onShareTimeline(res) {
				if (res.from && res.from == "button") {
					if (res.target.dataset !== null && res.target.dataset !== undefined && res.target.dataset.postid !==
						undefined) {
						let dataset = res.target.dataset
						let circle = dataset.circle
						let author = dataset.author
						let postId = dataset.postid
						let title = "快来围观“@" + author + "”在圈子《" + circle + "》发表的精彩动态吧~"
						return {
							title: title,
							path: '/pages/lessuse/active-list/active-list?postId=' + postId + '&outside=1'
						}
					}
				}
				return {
					title: '来自TopicQ《' + this.circle.name + '》圈子的精彩内容',
					path: '/pages/lessuse/circle-profile/circle-profile?circleId=' + this.circleId + '&outside=1'
				}
			},
			praiseAction(index) {
				let post = this.dataList[index]
				let oldStatus = post.is_praise
				let newStatus = post.is_praise == 1 ? 0 : 1
				this.dataList[index].is_praise = newStatus
				praise(post.post_id).then(res => {
					this.dataList[index].is_praise = newStatus
					if (newStatus == 1) {
						this.dataList[index].praise_count++
					} else {
						this.dataList[index].praise_count--
					}
					this.$forceUpdate()
				}).catch(error => {
					this.dataList[index].is_praise = oldStatus
				})
			},
			favoriteAction(index) {
				let post = this.dataList[index]
				let oldStatus = post.is_favorite
				let newStatus = post.is_favorite == 1 ? 0 : 1
				this.dataList[index].is_favorite = 1
				favoritePost(post.post_id).then(res => {
					this.dataList[index].is_favorite = newStatus
					if (newStatus == 1) {
						this.dataList[index].favorite_count++
					} else {
						this.dataList[index].favorite_count--
					}
					this.$forceUpdate()
				}).catch(error => {
					this.dataList[index].is_favorite = oldStatus
				})
			},
			chooseScoreAction(params) {
				let score = params[0]
				let index = params[1]
				let postId = this.dataList[index].post_id
				uni.showLoading({
					title: '正在提交...'
				})
				rewardOther(postId, score).then(res => {
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '打赏成功'
					})
					this.showScorePay = false
					updateUserInfo()
					setTimeout(() => {
						this.userInfo = getUserInfo()
					}, 300)
				}).catch(error => {

				})
			},
			rewardAction(index) {
				let otherUserId = this.dataList[index].author.user_id
				if (otherUserId == this.userInfo.user_id) {
					uni.showToast({
						icon: 'none',
						title: '不要自己打赏自己哦~'
					})
					return
				}
				this.showScorePay = true
				this.scorePostIndex = index
			},
			onReplySuccess(params) {
				let postIndex = params[0]
				let comment = params[1]
				let commentList = [comment]
				this.dataList[postIndex].comment_count++
				this.dataList[postIndex].comment_list = commentList.concat(this.dataList[postIndex].comment_list)
			},
			onCommentSuccess(params) {
				let postIndex = params[0]
				let comment = params[1]
				let commentList = [comment]
				this.dataList[postIndex].comment_count++
				this.dataList[postIndex].comment_list = commentList.concat(this.dataList[postIndex].comment_list)
			},
			replyComment(params) {
				let post = this.dataList[params[0]]
				let comment = post.comment_list[params[1]]
				let info = {
					'postId': post.post_id,
					'commentId': comment.comment_id,
					'replyUser': comment.author.nickname,
					'postIndex': params[0]
				}
				this.inputPanelOriginInfo = info
				this.showInputPanel = true
			},
			loadMoreComment(index, post) {
				if (post.comment_load_finish) {
					return
				}
				let lastCommentId = post.comment_list[post.comment_list.length - 1].comment_id
				let num = 5
				getActivePostCommentList(post.post_id, lastCommentId, num).then(res => {
					post.comment_list = post.comment_list.concat(res.data)
					if (post.comment_list.length >= post.comment_count) {
						post.comment_load_finish = true
					}
				}).catch(error => {

				})
			},
			expandAction(index) {
				this.dataList[index].is_expand = !this.dataList[index].is_expand
			},
			sendCommentAction(index, post) {
				let info = {
					'postId': post.post_id,
					'postIndex': index
				}
				this.inputPanelOriginInfo = info
				this.showInputPanel = true
			},
			jumpToPublish() {
				if (isLogin() == false) {
					checkLogin()
					return
				}
				let isCircleOwner = this.circle.owner_id == this.userInfo.user_id
				if (this.circle.is_joined == 0 && !isCircleOwner) {
					let that = this
					uni.showModal({
						title: '提示',
						content: '入圈后可发表动态',
						confirmText: '立即加入',
						success(res) {
							if (res.confirm) {
								that.applyJoinAction()
							}
						}
					})
					return
				}
				uni.navigateTo({
					url: '/pages/publish/publish-active?circleId=' + this.circleId
				})
			},
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
				if (this.circle == null) {
					return
				}
				if (this.mescroll) {
					this.mescroll.triggerDownScroll()
				}
			},
			initCircleInfo() {
				uni.showLoading({
					title: '正在加载...'
				})
				getCircleInfo(this.circleId).then(res => {
					uni.hideLoading()
					this.circle = res.data
				}).catch(error => {
					uni.hideLoading()
				})
			},
			backAction() {
				if (this.isFromOutside) {
					uni.reLaunch({
						url: '/pages/index/index'
					})
					return
				}
				uni.navigateBack({
					delta: 1
				})
			},
			getDataList(pageIndex, pageSize) {
				this.floatBarNeedAction = false
				if (this.TabCur == 3) {
					getCircleMemberList(this.circleId, pageIndex, pageSize).then(res => {
						let pageList = res.data.list
						if (pageIndex == 0) {
							this.dataList = pageList
						} else {
							this.dataList = this.dataList.concat(pageList);
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
						this.floatBarNeedAction = true
					}).catch(error => {
						if (this.mescroll) {
							this.mescroll.endErr()
						}
						this.floatBarNeedAction = true
					})
					return
				}
				if (this.TabCur == 2) {
					getTopicListByCircleId(this.circleId, pageIndex, pageSize).then(res => {
						let pageList = res.data.list
						if (pageIndex == 0) {
							this.dataList = pageList
						} else {
							this.dataList = this.dataList.concat(pageList);
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
						this.floatBarNeedAction = true
					}).catch(error => {
						if (this.mescroll) {
							this.mescroll.endErr()
						}
						this.floatBarNeedAction = true
					})
					return
				}
				let type = this.TabCur == 0 ? 1 : 0;
				getActivePostListByCircle(this.circleId, pageIndex, pageSize, type).then(res => {
					res.data.list.forEach(item => {
						item.is_expand = false
						item.show_time = getTimeDistance(item.created_at)
						if (item.rich_content && item.rich_content.length > 0) {
							item.rich_content = JSON.parse(item.rich_content)
							item.is_rich_content = true
						}
						if(item.comment_list&&item.comment_list.length>0) {
							item.comment_list.forEach(comment=>{
								comment.is_expand = false
							})
						}
					})
					let pageList = res.data.list
					if (pageIndex == 0) {
						this.dataList = pageList
					} else {
						this.dataList = this.dataList.concat(pageList);
					}
					console.log('page length:' + pageList.length)
					let hasNext = pageList.length >= pageSize
					if (this.mescroll) {
						this.mescroll.endSuccess(pageList.length, hasNext);
					}
					this.floatBarNeedAction = true
				}).catch(error => {
					if (this.mescroll) {
						this.mescroll.endErr()
					}
					this.floatBarNeedAction = true
				})
			},
			downCallback() {
				this.initCircleInfo()
				if (this.mescroll) {
					this.mescroll.resetUpScroll()
				}
			},
			upCallback(page) {
				let pageIndex = page.num - 1
				this.getDataList(pageIndex, page.size)
			},
		},
	}
</script>

<style scoped>
	.header-bg {
		width: 100%;
		height: 100%;
		position: relative;
		z-index: 2;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.float-bar {
		position: fixed;
		width: 100%;
		bottom: 50upx;
		z-index: 1024;
	}

	.input-panel {
		position: fixed;
		height: 100%;
		width: 100%;
		bottom: 0%;
		z-index: 9999;
	}
</style>
